<template>
    <div class="qilin-QilinExplain qilin-mb-4 qilin-panel qilin-shadow qilin-radius-default">
        <div class="qilin-QilinExplain-header qilin-p-2">
            <span>{{title}}</span>
        </div>
        <div class="qilin-QilinExplain-content qilin-px-2 qilin-py-4">
            <slot name="content"></slot>
        </div>
        <div class="qilin-QilinExplain-footer qilin-p-2">
            <span>创建于：{{getDate}}</span>
        </div>
    </div>
</template>
<script>
import Qilin from "qilin-utils";
export default {
    props:{
        title:{
            type:String,
            default:"示例"
        },
        date:{
            type:String | Date,
            default(){
                return new Date();
            }
        }
    },
    computed:{
        getDate(){
            // return Qilin.Date.formatDate(this.date,"yyyy-MM-dd");
            return this.$Qilin.Date.formatDate(this.date,"chinese");
        }
    }
}
</script>
<style lang="less" scoped>
.qilin-QilinExplain{
    >.qilin-QilinExplain-header{
        font-size:@size-text-medium;
        font-weight:bolder;
        border-bottom:1px solid @color-border;
    }
    >.qilin-QilinExplain-footer{
        border-top:1px solid @color-border;
        color:@color-text-support;
    }
}
</style>